<template>
    <div class="head">
        <slot name="left">
            <van-badge :content="5">
                <van-icon name="manager" class="iconmar" size=".25rem" />
            </van-badge>
        </slot>
        <slot name="center">
            <van-search @click="$router.push('/search')" class="cet" shape="round" v-model="value" placeholder="大家都在搜" />
        </slot>
        <slot name="right">
            <van-icon name="audio" class="iconmar" size=".25rem" />
        </slot>
    </div>
</template>

<script>
export default {
    name:'myhead',
    data() {
        return {
            value:''
        };
    },
};
</script>

<style scoped lang="scss">
.head{
    display: flex;
    align-items: center;
    background-color: #F1F3F2;
    .cet{
        flex: 1;
        background-color: #F1F3F2;
        text-align: center;
        .van-search__content{
            background-color: #fff;
            padding-right: 12px;
        }
    }
    .iconmar{
        margin: 0px .08rem;
    }
}
</style>
